
function All(ele) {
  // 搜索分页
  this.oSBox = $(ele)
  this.oSInp = this.oSBox.find(".seach-inp")
  this.oSBtn = this.oSBox.find(".icon-sousuoxiao")
  this.oPaginator = $(".paginator")
  this.oPnum
  this.oGoodList = $(".search_list ul")[0]
  this.oFsort = $(".filter_sort")


  this.oCateS = $(".cate_sort")
  this.oModWord = $(".mod_word")



  this.num = 20
  this.total
  this.page = 1
  // this.kw 
  this.kw = location.search.split('=')[1]
  this.kw ? this.kw=decodeURIComponent(location.search.split('=')[1]) : this.kw=""
  console.log(this.kw);

  this.orderName = "goods_id"
  this.orderType = 1
  this.kwShow()
  this.AllEvent()
}

All.prototype.kwShow = function () {
  all({
    orderName: this.orderName,
    type: this.orderType,
    kw: this.kw,
    num: this.num,
    page: this.page
  }).then(res => {
    if(res.data){
      $(".empty_result").css("display","none")
    }else{     
      $(".empty_result").css("display","flex")
      return
    }
    let html = ""
    res.data.forEach(v => {
      html += `<li>
      <a href="./detail.html?id=${v.goods_id}" class="search_list_img">
        <img src="${v.goods_imgs}" alt="">
      </a>
      <p class="sell_price">￥${v.goods_price}</p>
      <a href="./detail.html?id=${v.goods_id}" class="search_list_text">
        <p class="sell_describe">${v.goods_title}</p>
        <p class="sell_point">${v.goods_text}</p>
      </a>
      <span>${v.goods_span}</span>
    </li>`

    });
    this.oGoodList.innerHTML = html
    this.total = Math.ceil(res.total / this.num)
    let pagehtml = ""
    for (var i = 1; i <= this.total; i++) {
      pagehtml += `<a class="page_num" index=${i}>${i}</a>`
    }
    this.oPaginator[0].innerHTML = `<span class="pag_prev">&lt;</span>
    ${pagehtml}
    <span class="pag_next">&gt;</span>`

    //页数样式
    this.oPnum = $(".page_num")
    for (var i = 0; i < this.oPnum.length; i++) {
      if ($(this.oPnum[i]).attr("index") == this.page) {
        $(this.oPnum[i]).addClass("off")
      }
    }

    //头部导航样式
    for (var i = 0; i <$(".mod_word").length; i++) {
      $($(".mod_word")[i]).css("color","#747474")
      if ($($(".mod_word")[i]).html() == this.kw) {
        $($(".mod_word")[i]).css("color","#0092d8")
      }
    }``

  })

}

All.prototype.AllEvent = function () {
  //点击搜索
  this.oSBtn.click(() => {
    this.kw = this.oSInp.val()
    if (this.kw) {
      this.page = 1
      this.kwShow()
    }
  })


  // 点击分页
  this.oPaginator.click((e) => {
    const target = e.target
    //下一页
    if (target.classList.contains("pag_next")) {
      console.log(target);
      console.log(123);
      if (this.page >= this.total) {
        return
      }
      this.page++
      this.kwShow()
    }
    //上一页
    if (target.classList.contains("pag_prev")) {
      if (this.page <= 1) {
        return
      }
      this.page--
      this.kwShow()
    }
    //点击页数翻页
    if (target.classList.contains("page_num")) {
      this.page = target.innerHTML
      this.kwShow()
      // $(target).addClass("off")
    }
  })


  //点击排序
  this.oFsort.click((e) => {
    const target = e.target
    //下一页
    if (target.tagName == "LI") {
      this.orderType = $(target).attr("index")
      this.orderName = "goods_price"
      this.kwShow()
      $(target).parent().prev().prev().html(target.innerHTML)
      $(target).parent().prev().prev().css("color", "#0092d8")
    }
  })


  //点击分类栏
  this.oCateS.click((e) => {
    const target = e.target
    if (target.classList.contains("mod_word")) {
      this.kw = $(target).html()
      if ($(target).html() == "全部洗衣机") {
        this.kw = "洗衣机"
      }
      this.kwShow()
      this.oModWord.removeClass("off")
      $(target).addClass("off")
    }
  })
}




new All(".seach-box")